Crossing Photos

Crossing Photos, by Bill Scott

Save this script, midi,
a background image
and two images to scroll to a folder.
(The image size is the size of the larger image.)

Change the areas in RED as needed.

<HTML><HEAD>
<TITLE></TITLE>
<STYLE>
body{html, body {
font-size:10pt;
color:#000000;
font-family:arial, tahoma}

.letterStyle {
COLOR: #ffffff;
FONT-FAMILY:comic sans ms;
FONT-SIZE:14pt;
padding-top:30px;
padding-right:10%;
padding-bottom:30px;
padding-left:10%}

</STYLE>

<SCRIPT language=VBS>
'----------------------------------------------------------------------------
' Crossing Photos, by Bill Scott
'----------------------------------------------------------------------------
' All HTML and script by Bill Scott, July, 2000
' billscott@redrivernet.com

' Crossing Photos HTML and Script follows:

Option Explicit

Dim screenx, screeny, proportion
Dim flag1, flag2
Dim imageHeight
Dim resizeFlag
Dim x1, x1i
Dim y1
Dim x2, x2i
Dim y2

' Image height compared to window height
imageHeight=.5

resizeFlag=false

Sub Window_OnLoad()
window.scrollTo 0,0
flag1=false
flag2=false
screenx=document.body.clientWidth
screeny=document.body.clientHeight

proportion=Image1.offsetHeight/Image1.offsetWidth
Image1.style.posHeight=screeny*imageHeight
Image1.style.posWidth=Image1.style.posHeight/proportion

proportion=Image2.offsetHeight/Image2.offsetWidth
Image2.style.posHeight=screeny*imageHeight
Image2.style.posWidth=Image2.style.posHeight/proportion

Image1.style.posTop=0
Image1.style.posLeft=-(Image1.style.posWidth)

Image2.style.posTop=0
Image2.style.posLeft=screenx

if Image1.style.posWidth>screenx/2 then Image1.style.posWidth=screenx/2
if Image2.style.posWidth>screenx/2 then Image2.style.posWidth=screenx/2

topStrip.style.posWidth=screenx
topStrip.style.posHeight=Image1.style.posHeight
topStrip.style.posLeft=0
topStrip.style.posTop=0

letter.style.posWidth=screenx
letter.style.posLeft=0
letter.style.posTop=topStrip.style.posHeight

topStrip.style.visibility="visible"

letter.style.visibility="visible"

x1i=1
x1=-(Image1.style.posWidth)
y1=screenx-Image1.style.posWidth

x2i=-1
x2=screenx
y2=0

crossPix1
crossPix2
End Sub

Sub Window_OnResize()
if resizeFlag then
window.scrollTo 0,0
Window_OnLoad
resizeFlag=false
Exit Sub
else
resizeFlag=true
end if
End Sub

sub crossPix1()
x1=x1+x1i
Image1.style.left=x1
if x1>=y1 then Exit Sub
SetTimeOut"crossPix1",30
end sub

sub crossPix2()
x2=x2+x2i
Image2.style.left=x2
if x2<=0 then Exit Sub
SetTimeOut"crossPix2",30
end sub

</SCRIPT>

<BGSOUND balance=0 loop=-1 src="midi.mid" volume=0>

</HEAD>

<BODY background="bg.jpg" bgColor=#ffffff>

<DIV id=topStrip style="z-index:1; visibility:hidden; position:absolute; left:-1800px; background-color:#000000"> </DIV>

<DIV id=letter class=letterStyle style="visibility:hidden; width:576px; HEIGHT: 423px; LEFT:20px; POSITION:absolute; top:20px"><font color=#000000>Sample Text Here. Double-click here to set cursor.</font>
</DIV>

<IMG id=Image1 src="1.jpg"
style="z-index:2; position:absolute; left:-1800px" border=0>

<IMG id=Image2 src="2.jpg"
style="z-index:2; position:absolute; left:-1800px" border=0>

<script language="JavaScript">

</script>

</BODY></HTML>